<template>
	<view style="background-color: black; width: 100vw;height: 100vh;">
		<image style="width: 100vw;" :src="tempFilePathslist[0]" mode="widthFix"></image>
		<view
			style="position: fixed;bottom: 0;width: 100vw;height: 398rpx;border-radius: 12rpx 12rpx, 0px, 0px;background: rgba(255, 255, 255, 1);">
			<view @click="uplood1" class="flex-center"
				style="padding: 20rpx 0; border-bottom: 2rpx solid rgba(234, 234, 234, 1) ;">
				拍照
			</view>
			<view @click="uplood2" class="flex-center"
				style="padding: 20rpx 0; border-bottom: 2rpx solid rgba(234, 234, 234, 1) ;">
				从手机相册选择
			</view>
			<view @click="save" class="flex-center"
				style="padding: 20rpx 0; border-bottom: 2rpx solid rgba(234, 234, 234, 1) ;">
				保存图片
			</view>
			<view style="height: 10rpx;opacity: 1;background: rgba(237, 237, 237, 1);">

			</view>
			<view class="flex-center" style="padding: 40rpx 0; border-bottom: 2rpx solid rgba(234, 234, 234, 1) ;"
				@click="cancel">
				取消
			</view>
		</view>
	</view>
</template>

<script>
	export default {

		data() {
			return {
				urls: '',
				tempFilePathslist: []
			}
		},
		onLoad(e) {
			this.tempFilePathslist.push(e.url)
		},
		methods: {
			async save() {
				let res = await this.$http.post('user/update_nickname_headimgurl', {

					nickname: uni.getStorageSync('usinfo').nickname,
					headimgurl: this.urls,
				})
				if (res) {
					uni.showToast({
						title: '操作成功',
						icon: 'none'
					})
					setTimeout(() => {
						uni.switchTab({
							url: '/pages/uset/uset'
						})
					}, 500)
				}
			},
			uplood1() {
				var taht = this
				uni.chooseImage({
					count: 1,
					sizeType: ['compressed'],
					sourceType: ['camera'],
					success: function(res) {
						console.log(res);
						taht.tempFilePathslist = res.tempFilePaths

						taht.uploadImage(res.tempFilePaths)
					}
				});
			},
			uplood2() {
				var taht = this
				uni.chooseImage({
					count: 1,
					sizeType: ['compressed'],
					sourceType: ['album'],
					success: function(res) {
						console.log(res);
						taht.tempFilePathslist = res.tempFilePaths


						taht.uploadImage(res.tempFilePaths)
					}
				});
			},
			uploadImage(tempFilePaths) {
				console.log(tempFilePaths, '88888');
				let _this = this;
				uni.showLoading({
					title: '图片上传中'
				});
				uni.uploadFile({
					url: this.baseUrl + 'user/file_up', //接口地址
					header: {
						// "uid": uni.getStorageSync('token'),
					},
					filePath: tempFilePaths[0],
					name: 'file',
					success: (res) => {
						let data = JSON.parse(res.data);
						console.log(data);
						_this.urls = data.data.url
						console.log(_this.urls);
						this.updateInfo()
						uni.$u.sleep(500).then(() => {
							uni.showToast({
								icon: 'success',
								title: '上传成功！'
							})
						})
					},
					complete() {
						uni.hideLoading()
					}
				});
			},
			updateInfo() {
				let param = {
					headimgurl: this.urls,
					nickname: this.userInfo.nickname
				}
				this.$http.post('user/update_nickname_headimgurl', param).then(res => {
					if (res.code == 200) {
						this.getUserInfo()
						this.cancel()
					}
				})
			},
			cancel() {
				uni.navigateBack()
			}

		}
	}
</script>

<style>

</style>